import React from 'react';

export const CleanIcon = () => (
  <svg viewBox="0 0 24 24" fill="none">
    <path
      d="M16.19 2H7.81C4.17 2 2 4.17 2 7.81v8.37C2 19.83 4.17 22 7.81 22h8.37c3.64 0 5.81-2.17 5.81-5.81V7.81C22 4.17 19.83 2 16.19 2Zm-.43 13.76c-.06.85-.13 1.91-2.05 1.91h-3.42c-1.91 0-1.99-1.06-2.05-1.91l-.31-3.96a.94.94 0 0 1 .24-.7.9.9 0 0 1 .67-.29h6.32c.25 0 .5.11.67.29.17.19.26.44.24.69l-.31 3.97Zm1.04-5.94h-.06c-1.04-.1-1.99-.17-2.9-.21a40.81 40.81 0 0 0-3.67-.03c-.6.03-1.21.07-1.81.13l-1.09.11H7.2c-.35 0-.65-.26-.68-.62-.04-.37.24-.71.61-.74l1.09-.11c.43-.04.85-.07 1.28-.09l.08-.47c.08-.5.23-1.46 1.73-1.46h1.39c1.51 0 1.66.99 1.73 1.47l.08.48c.75.04 1.52.1 2.36.18.38.04.65.37.62.75-.04.35-.34.61-.69.61Z"
      fill="currentColor"
    />
  </svg>
);

export const DownloadIcon = () => (
  <svg viewBox="0 0 24 24" fill="none">
    <path
      d="M16.19 2H7.81C4.17 2 2 4.17 2 7.81v8.37C2 19.83 4.17 22 7.81 22h8.37c3.64 0 5.81-2.17 5.81-5.81V7.81C22 4.17 19.83 2 16.19 2Zm.63 12.24-4.29 4.29a.75.75 0 0 1-1.06 0l-4.29-4.29a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l3.01 3.01V6c0-.41.34-.75.75-.75s.75.34.75.75v10.19l3.01-3.01c.29-.29.77-.29 1.06 0 .15.15.22.34.22.53s-.08.39-.22.53Z"
      fill="currentColor"
    />
  </svg>
);

export const ThemeIcon = () => (
  <svg viewBox="0 0 24 24" fill="none">
    <path
      d="M22 16.5v3a2.5 2.5 0 0 1-2.5 2.5h-7.14c-.89 0-1.33-1.07-.71-1.7l5.87-6c.19-.19.45-.3.71-.3h1.27a2.5 2.5 0 0 1 2.5 2.5Zm-3.63-5.21L15.66 14l-2.46 2.45c-.63.63-1.71.19-1.71-.7V7.26c0-.27.11-.52.29-.71l.92-.92c.98-.98 2.56-.98 3.54 0l2.12 2.12c.99.98.99 2.56.01 3.54ZM7.5 2h-3C3 2 2 3 2 4.5V18c0 .27.03.54.08.8.03.13.06.26.1.39.05.15.1.3.16.44.01.01.01.02.01.02.01 0 .01 0 0 .01.14.28.3.55.49.8.11.13.22.25.33.37.11.12.23.22.36.32l.01.01c.25.19.52.35.8.49.01-.01.01-.01.01 0 .15.07.3.12.46.17.13.04.26.07.39.1.26.05.53.08.8.08.41 0 .83-.06 1.22-.19.11-.04.22-.08.33-.13.35-.14.69-.34.99-.6.09-.07.19-.16.28-.25l.04-.04C9.56 20.07 10 19.08 10 18V4.5C10 3 9 2 7.5 2ZM6 19.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5Z"
      fill="currentColor"
    />
  </svg>
);

export const CodeIcon = () => (
  <svg viewBox="0 0 24 24" fill="none">
    <path
      d="M16 2H8C4.5 2 3 4 3 7v10c0 3 1.5 5 5 5h8c3.5 0 5-2 5-5V7c0-3-1.5-5-5-5Zm-5.47 14.47c.29.29.29.77 0 1.06-.15.15-.34.22-.53.22s-.38-.07-.53-.22l-2-2a.754.754 0 0 1 0-1.06l2-2c.29-.29.77-.29 1.06 0 .29.29.29.77 0 1.06L9.06 15l1.47 1.47Zm6-.94-2 2c-.15.15-.34.22-.53.22s-.38-.07-.53-.22a.754.754 0 0 1 0-1.06L14.94 15l-1.47-1.47a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l2 2c.29.29.29.77 0 1.06Zm1.97-6.28h-2c-1.52 0-2.75-1.23-2.75-2.75v-2c0-.41.34-.75.75-.75s.75.34.75.75v2c0 .69.56 1.25 1.25 1.25h2c.41 0 .75.34.75.75s-.34.75-.75.75Z"
      fill="currentColor"
    />
  </svg>
);

export const SettingIcon = () => (
  <svg viewBox="0 0 24 24" fill="none">
    <path
      d="M16.19 2H7.81C4.17 2 2 4.17 2 7.81v8.37C2 19.83 4.17 22 7.81 22h8.37c3.64 0 5.81-2.17 5.81-5.81V7.81C22 4.17 19.83 2 16.19 2ZM7.67 5.5c0-.41.34-.75.75-.75s.75.34.75.75v3.9c0 .41-.34.75-.75.75s-.75-.34-.75-.75V5.5Zm1.853 10.931a.566.566 0 0 0-.353.505V18.5c0 .41-.34.75-.75.75s-.75-.34-.75-.75v-1.564a.567.567 0 0 0-.353-.505A2.713 2.713 0 0 1 5.7 13.95c0-1.5 1.22-2.73 2.72-2.73 1.5 0 2.73 1.22 2.73 2.73 0 1.108-.67 2.057-1.627 2.481ZM16.33 18.5c0 .41-.34.75-.75.75s-.75-.34-.75-.75v-3.9c0-.41.34-.75.75-.75s.75.34.75.75v3.9Zm-.75-5.73c-1.5 0-2.73-1.22-2.73-2.73 0-1.108.67-2.057 1.627-2.481a.566.566 0 0 0 .353-.505V5.5c0-.41.34-.75.75-.75s.75.34.75.75v1.564c0 .223.15.414.353.505A2.713 2.713 0 0 1 18.3 10.05c0 1.5-1.22 2.72-2.72 2.72Z"
      fill="currentColor"
    />
  </svg>
);

export const JpgIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="M18 22H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h7a.104.104 0 0 1 .027 0h.006a.15.15 0 0 0 .029.006c.088.006.175.023.259.051h.042a.421.421 0 0 1 .052.043.988.988 0 0 1 .293.2l6 6a.987.987 0 0 1 .2.293.735.735 0 0 1 .023.066l.01.028c.028.083.044.17.049.258a.1.1 0 0 0 .007.029v.006A.112.112 0 0 1 20 9v11a2 2 0 0 1-2 2Zm-2.539-8a1.4 1.4 0 0 0-1.188.545 2.552 2.552 0 0 0-.406 1.547v.876c-.029.54.128 1.074.443 1.514.3.35.746.542 1.207.518.286.003.57-.05.836-.154h.008-.006a.189.189 0 0 1 .029-.014h.005l.016-.008.021-.01c.218-.1.412-.247.568-.43v-2.011H15.45v.742h.637v.893l-.08.06a.753.753 0 0 1-.436.117.661.661 0 0 1-.607-.3 1.962 1.962 0 0 1-.183-.969v-.883a1.985 1.985 0 0 1 .173-.925.574.574 0 0 1 .535-.292.55.55 0 0 1 .446.171c.12.19.182.408.18.632H17a1.933 1.933 0 0 0-.433-1.227c-.297-.28-.7-.421-1.106-.392ZM7 17.5c-.021.396.1.787.344 1.1.244.272.598.419.963.4.362.009.709-.149.941-.427a1.7 1.7 0 0 0 .365-1.137v-3.369H8.7v3.322c0 .528-.133.8-.4.8s-.393-.232-.393-.689H7Zm3.327-3.429v4.866h.91v-1.715h.607c.405.022.802-.128 1.09-.414a1.58 1.58 0 0 0 .392-1.13 1.69 1.69 0 0 0-.4-1.164c-.27-.3-.661-.464-1.065-.447l-1.534.004ZM13 4v5h5l-5-5Zm-1.138 12.4h-.625v-1.515h.635c.16 0 .307.084.39.221.105.174.156.375.146.578a.866.866 0 0 1-.142.535.483.483 0 0 1-.404.181Z"
      fill="currentColor"
    />
  </svg>
);

export const PngIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="M18 22H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h7a.104.104 0 0 1 .027 0h.006a.15.15 0 0 0 .029.006c.088.006.175.023.259.051h.042a.421.421 0 0 1 .052.043.988.988 0 0 1 .293.2l6 6a.987.987 0 0 1 .2.293.735.735 0 0 1 .023.066l.01.028c.028.083.044.17.049.258a.1.1 0 0 0 .007.029v.006A.112.112 0 0 1 20 9v11a2 2 0 0 1-2 2Zm-2.458-8a1.3 1.3 0 0 0-1.126.545 2.66 2.66 0 0 0-.384 1.547v.876a2.479 2.479 0 0 0 .419 1.514c.277.348.705.54 1.149.518.271.003.54-.05.791-.154l.021-.009a1.55 1.55 0 0 0 .588-.455v-2.009h-1.469v.742h.6v.893l-.076.06a.689.689 0 0 1-.414.117.62.62 0 0 1-.575-.3 2.063 2.063 0 0 1-.173-.969v-.883c-.016-.317.04-.633.165-.925a.537.537 0 0 1 .507-.292c.16-.013.317.05.423.171.113.191.171.41.17.632H17a2 2 0 0 0-.41-1.227A1.34 1.34 0 0 0 15.543 14h-.001Zm-4.258 1.746 1.259 3.187h.857v-4.866h-.855v3.195l-1.263-3.195h-.862v4.866h.862v-3.187h.002ZM7 14.067v4.866h.862v-1.711h.575c.388.02.766-.131 1.032-.414.262-.317.395-.72.373-1.13a1.747 1.747 0 0 0-.379-1.164 1.253 1.253 0 0 0-1.009-.447H7ZM13 4v5h5l-5-5ZM8.454 16.4h-.592v-1.515h.6a.432.432 0 0 1 .37.221c.1.176.148.376.138.578a.9.9 0 0 1-.135.535.448.448 0 0 1-.381.181Z"
      fill="currentColor"
    />
  </svg>
);

export const SvgIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg viewBox="0 0 24 24" fill="none" {...props}>
    <path
      d="M18 22H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h7a.104.104 0 0 1 .027 0h.006a.15.15 0 0 0 .029.006c.088.006.175.023.259.051h.042a.421.421 0 0 1 .052.043.988.988 0 0 1 .293.2l6 6a.987.987 0 0 1 .2.293.735.735 0 0 1 .023.066l.01.028c.028.083.044.17.049.258a.1.1 0 0 0 .007.029v.006A.112.112 0 0 1 20 9v11a2 2 0 0 1-2 2Zm-2.5-8c-.454-.024-.89.18-1.161.545a2.6 2.6 0 0 0-.4 1.547v.876a2.426 2.426 0 0 0 .432 1.514c.29.35.728.541 1.181.518.28.003.557-.05.816-.154l.013-.005-.016.007c.245-.101.46-.26.63-.464v-2.011h-1.509v.742h.623v.893l-.078.06a.723.723 0 0 1-.427.117.641.641 0 0 1-.592-.3 2.01 2.01 0 0 1-.178-.969v-.883a2.018 2.018 0 0 1 .166-.926.557.557 0 0 1 .523-.292.531.531 0 0 1 .435.171c.117.19.177.41.175.632H17a1.96 1.96 0 0 0-.423-1.227A1.4 1.4 0 0 0 15.5 14ZM7 17.4c-.006.296.063.59.2.852.126.234.317.426.55.555.237.129.503.195.773.193.366.02.724-.11.994-.357a1.33 1.33 0 0 0 .366-.993c.013-.34-.09-.676-.293-.95a2.186 2.186 0 0 0-.934-.632 1.652 1.652 0 0 1-.513-.334.536.536 0 0 1-.143-.367.608.608 0 0 1 .13-.408.45.45 0 0 1 .363-.154c.148-.008.29.06.377.181A.853.853 0 0 1 9 15.5h.886a1.739 1.739 0 0 0-.172-.782 1.245 1.245 0 0 0-.487-.531A1.382 1.382 0 0 0 8.505 14a1.409 1.409 0 0 0-1 .374 1.3 1.3 0 0 0-.393.986 1.4 1.4 0 0 0 .291.882c.258.293.585.516.951.649.186.072.356.18.5.317.101.127.15.287.139.448 0 .361-.157.544-.465.544a.58.58 0 0 1-.484-.19 1.012 1.012 0 0 1-.148-.612L7 17.4Zm3.182-3.332 1.26 4.866h.925l1.269-4.866h-.991L11.9 17.6l-.737-3.529-.981-.003ZM13 4v5h5l-5-5Z"
      fill="currentColor"
    />
  </svg>
);

export const CheckIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg viewBox="0 0 1024 1024" {...props}>
    <path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7-210.6 292a31.8 31.8 0 0 1-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z" />
  </svg>
);

export const ArrorRightIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg viewBox="0 0 24 24" {...props} fill="currentColor">
    <path d="m13.061 4.939-2.122 2.122L15.879 12l-4.94 4.939 2.122 2.122L20.121 12z" />
    <path d="M6.061 19.061 13.121 12l-7.06-7.061-2.122 2.122L8.879 12l-4.94 4.939z" />
  </svg>
);
